
import React from 'react';
import { Descriptions, Avatar, Space } from 'antd';
import { PageContainer } from '@ant-design/pro-layout';
import Storage from "@/utils/storage"
import tools from "@/utils/tools"
import m_config from '@/config/config'
const { getCurrentTime } = tools;

import './index.less'
class DashBoard extends React.Component {

    constructor(props) {
        super(props)
    }

    state = {
        userinfo: null,
        curTime: null,
    }


    componentWillMount() {
        let userinfo = new Storage().get("user__info")?.data || null;
        this.setState({
            userinfo
        })
    }

    componentDidMount() {
        this.interval = setInterval(() => this.setState({
            curTime: getCurrentTime()
        }), 1000)
    }

    componentWillUnmount() {
        clearInterval(this.interval)
    }

    render() {
        const { userinfo, curTime } = this.state;

        return <>
            <PageContainer>
                <div className="dash-container">
                    <Space>
                        <Avatar size={64} src={m_config.local + userinfo.avatar_url + userinfo.avatar} />
                        <h2>欢迎，{userinfo.username}</h2>
                    </Space>
                </div>
                <div className="dash-container">
                    <Descriptions title="管理员信息">
                        <Descriptions.Item label="用户名">{userinfo.username}</Descriptions.Item>
                        <Descriptions.Item label="邮箱">{userinfo.email}</Descriptions.Item>
                        <Descriptions.Item label="创建时间">{userinfo.register_time}</Descriptions.Item>
                        <Descriptions.Item label="修改时间">{userinfo.update_time}</Descriptions.Item>
                        <Descriptions.Item label="登录时间">{userinfo?.login_time || "无登录时间"}</Descriptions.Item>
                        <Descriptions.Item label="当前时间">{curTime}</Descriptions.Item>
                    </Descriptions>
                </div>
            </PageContainer>
        </>
    }
}

export default DashBoard;
